import React from 'react';
import { Menu, Dropdown, Icon, Avatar, Breadcrumb } from 'antd';
import style from './style.less';

const logOut = () => {
	window.sessionStorage.clear();
};

const menu = (
	<Menu>
		<Menu.Item>
			<a onClick={logOut}>退出登陆</a>
		</Menu.Item>
	</Menu>
);

const Header = () => {
	return (
		<div className={style.headerBox}>
			<Breadcrumb>
				<Breadcrumb.Item>主页</Breadcrumb.Item>
				<Breadcrumb.Item>个人中心</Breadcrumb.Item>
				<Breadcrumb.Item>用户管理</Breadcrumb.Item>
				<Breadcrumb.Item>测试</Breadcrumb.Item>
			</Breadcrumb>
			<div>
				<Avatar className={style.avatar} size={36} icon="user" />
				<Dropdown overlay={menu}>
					<span className="ant-dropdown-link">
            用户信息 <Icon type="down" />
					</span>
				</Dropdown>
			</div>
		</div>
	);
};

export default Header;